//设置定时器
//如果用户五秒之内没有点击信封，就会显示文字
//文字持续闪动效果，用过渡，和不取消的定时器
window.onload = () => {
    var text = document.querySelector('.envelope-text');
    var envelope = document.querySelector('.envelope');
    var envelopeCoat = document.querySelector('.envelope-coat');

    //5秒钟后显示文字
    function textBlock() {
        text.style.display = 'block';
    }
    setTimeout(textBlock, 2000);

    //文字闪动
    // 设置初始状态
    var isVisible = true;
    function textBling() {
        //每隔1s切换一次状态
        isVisible = !isVisible;
        text.style.visibility = isVisible ? 'visible' : 'hidden';
    }
    var interval = setInterval(textBling, 1000);

    //点击之后停止定时器
    //整个页面慢慢变白跳转
    envelope.onclick = () => {
        clearInterval(interval);
        text.style.display = 'none';
        var currentOpacity = 0;
        var opacityStep = 0.01;

        var fadingInterval = setInterval(function () {
            // 逐渐增加背景颜色的透明度
            currentOpacity += opacityStep;

            // 边界检查，确保透明度在 [0, 1] 范围内
            currentOpacity = Math.min(1, currentOpacity);

            // 设置背景颜色，使用rgba表示颜色，其中a是透明度
            envelopeCoat.style.backgroundColor = 'rgba(255, 255, 255, ' + currentOpacity + ')';

            // 如果透明度为1，清除定时器
            if (currentOpacity >= 1) {
                clearInterval(fadingInterval);
            }
        }, 10); // 每10毫秒执行一次

        setTimeout(function () {
            window.location.href = "index.html";
        }, 1000);
    }



}


